<script setup>
import {ref} from "vue";
import Start from "./components/Start.vue";
import Nav from "./components/Nav.vue";

let pageHeight = ref(window.innerHeight - 60 + 'px');

window.onresize = function() {
  console.log("window onresize!");
  pageHeight = ref(window.innerHeight - 60 + 'px');
  console.log(pageHeight);
}

</script>

<template>
  <div class="app">
    <Nav />
    <div class="page" :style="{height: pageHeight}">
      <router-view></router-view>
    </div>
    
    <!-- <Start title="start" /> -->
  </div>
</template>

<style>
* {
  margin: 0;
  padding: 0;
}
.app {
  width: 100%;
  height: 100%;
  background-color: pink;
}

.page {
  background: url("./assets/start-bgPic.jpg") no-repeat;
  background-size: cover;
  overflow: auto;
}
</style>
